import React, {
    Component,
} from 'react';
import {
    StyleSheet,
    Text,
    View,
    Dimensions,
    TouchableOpacity,
    Image,
    ScrollView
} from 'react-native';
import { conditionObjWithType } from '../../../../utils/Conditions'


export default class CarDealBox extends Component {

    render() {
        return (
            <View style={styles.container}>
                <View style={styles.topBox}>
                    <Text style={styles.titleText}>成交信息</Text>
                </View>
                <View style={styles.carInfoBottomBox}>
                    <View style={styles.carInfoBottomItemBox}>
                        <Text style={styles.bottomTitleText}>{this.props.data.tradePrice ? (this.props.data.tradePrice/10000).toFixed(2)+'万元':'-'}</Text>
                        <Text style={styles.bottomDesText}>成交价格</Text>
                    </View>
                    <View style={styles.carInfoBottomItemBox}>
                        <Text style={styles.bottomTitleText}>{this.props.data.tradeDate ? this.props.data.tradeDate : '-'}</Text>
                        <Text style={styles.bottomDesText}>成交日期</Text>
                    </View>
                    <View style={styles.carInfoBottomItemBox}>
                        <Text style={styles.bottomTitleText}>{this.props.data.purchaserName ? this.props.data.purchaserName : '-'}</Text>
                        <Text style={styles.bottomDesText}>成交员工</Text>
                    </View>
                    <View style={styles.carInfoBottomItemBox}>
                        <Text style={styles.bottomTitleText}>{this.props.data.buyerName ? this.props.data.buyerName : '-'}</Text>
                        <Text style={styles.bottomDesText}>顾客名称</Text>
                    </View>
                </View>
            </View>
        )
    }

}

const styles = StyleSheet.create({
    container: {
        marginTop: 10,
        marginHorizontal: 8,
        borderRadius: 6,
        flexDirection: 'column',
        backgroundColor: '#fff',
        padding: 16,
    },
    topBox: {
        flexDirection: 'row',
        alignItems: 'center',
        justifyContent: 'space-between'
    },
    titleText: {
        color: '#333',
        fontWeight: '500',
        fontSize: 16
    },
    carInfoBottomBox: {
        backgroundColor: '#F4F4F4',
        marginTop: 16,
        flexDirection: 'row',
        justifyContent: 'space-between',
        alignItems: 'center',
        height: 65,
        paddingHorizontal: 12,
        borderRadius: 6,
    },
    carInfoBottomItemBox: {
        flexDirection: 'column',
        alignItems: 'center',
        justifyContent: 'center',
        height: '100%',
    },
    bottomTitleText: {
        fontSize: 14,
        fontWeight: '500',
        color: '#333333',
    },
    bottomDesText: {
        marginTop: 8,
        fontSize: 12,
        color: '#666666',
    },
})